<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="icon" href="/icon.png">
    <link rel="stylesheet" href="/css/public.css">
    <link rel="stylesheet" href="/css/index.css">
    <title>PandaShop_爱竹子,更爱购物</title>
</head>
<body class="clearfix">
<div id="nav_search">
    <div class="nav1">
        <ul class="fr">
            <li>
                <% if(user){ %>
                    你好，<%= user %>！
                    <a class="red" href="/logout">退出</a>
                <% }else{ %>
                    <a href="/login">你好，请登录</a>
                &nbsp;
                <a class="red" href="/register">免费注册</a>
                <% } %>
            </li>
            <li><a target="_blank" href="/usercenter">个人中心</a></li>
            <li><a href="">我的订单</a></li>
            <li class="hover">联系作者</li>
        </ul>
    </div>
    <div class="nav2 clearfix">
        <div class="logo"><img style="width:259px;height: 81px" src="/logo.png" alt="图片logo"></div>
        <div class="search">
            <img style="width: 25px;height: 25px;vertical-align:middle" src="/search.png">
            <input type="text" placeholder="输入关键词进行搜索">
            <span class="searchbtn">搜索</span>
        </div>
        <div id="author">
            <img style="width: 88px;height: 88px" src="/ewm.png">
        </div>
    </div>
</div>
<div id="ban_nav">
    <div id="banner">
        <div class="bd">
            <ul>
                <li><img style="width: 100%;height: 350px" src="/banner1.png"></li>
                <li style="display: none"><img style="width: 100%;height: 350px" src="/banner2.png"></li>
            </ul>
        </div>
        <div class="hd">
            <ul>
                <li class="light">1</li>
                <li>2</li>
            </ul>
        </div>
    </div>
    <div id="banner_nav">
        <ul>
            <li class="clearfix" flag="0">
                <span class="item_title">品牌手机</span>
                <span class="item clearfix">
                    <a href="">苹果</a>
                    <a href="">小米</a>
                    <a href="">荣耀</a>
                    <a href="">华为</a>
                    <a href="">vivo</a>
                    <a href="">oppo</a>
                </span>
            </li>
            <li class="clearfix" flag="1">
                <span class="item_title">电脑办公</span>
                <span class="item clearfix">
                    <a href="">笔记本</a>
                    <a href="">台式电脑</a>
                    <a href="">显示器</a>
                    <a href="">键盘</a>
                    <a href="">鼠标</a>
                    <a href="">打印机</a>
                </span>
            </li>
            <li class="clearfix" flag="2">
                <span class="item_title">手机配件</span>
                <span class="item clearfix">
                    <a href="">手机贴膜</a>
                    <a href="">手机壳</a>
                    <a href="">数据线</a>
                    <a href="">移动电源</a>
                    <a href="">智能穿戴</a>
                    <a href="">蓝牙耳机</a>
                </span>
            </li>
        </ul>
    </div>
    <div id="nav_detail">
        <ul>
            <li class="hidden clearfix" flag="0">
                <span class="item_title"><a href="javascript:;">华为手机</a></span>
                <span class="item clearfix">
                    <a href="">Mate30</a>
                    <a href="">畅享10 Plus</a>
                    <a href="">Mate30 Pro</a>
                    <a href="">P30 Pro</a>
                    <a href="">nova5 Pro</a>
                    <a href="">nova5i Pro</a>
                </span>
                <span class="item_title"><a href="javascript:;">vivo手机</a></span>
                <span class="item clearfix">
                    <a href="">Nex 3</a>
                    <a href="">iQOO Pro</a>
                    <a href="">Z5</a>
                    <a href="">Z5x</a>
                    <a href="">Z3</a>
                    <a href="">iQOO</a>
                </span>
                <span class="item_title"><a href="javascript:;">小米手机</a></span>
                <span class="item clearfix">
                    <a href="">note8P</a>
                    <a href="">note8</a>
                    <a href="">小米9</a>
                    <a href="">note7</a>
                    <a href="">红米7</a>
                    <a href="">小米CC9</a>
                </span>
            </li>
            <li class="hidden clearfix" flag="1">
                <span class="item_title"><a href="javascript:;">笔记本</a></span>
                <span class="item clearfix">
                    <a href="">联想</a>
                    <a href="">华硕</a>
                    <a href="">惠普</a>
                    <a href="">小米</a>
                    <a href="">华为</a>
                    <a href="">苹果</a>
                </span>
                <span class="item_title"><a href="javascript:;">键盘</a></span>
                <span class="item clearfix">
                    <a href="">无线键盘</a>
                    <a href="">机械键盘</a>
                    <a href="">罗技</a>
                </span>
                <span class="item_title"><a href="javascript:;">鼠标</a></span>
                <span class="item clearfix">
                    <a href="">罗技</a>
                    <a href="">雷蛇</a>
                    <a href="">无线鼠标</a>
                </span>
            </li>
            <li class="hidden clearfix" flag="2">
                <span class="item_title"><a href="javascript:;">热门推荐</a></span>
                <span class="item clearfix">
                    <a href="">蓝牙耳机</a>
                    <a href="">蓝牙音箱</a>
                    <a href="">手机耳机</a>
                    <a href="">智能手表</a>
                    <a href="">智能手环</a>
                    <a href="">手机U盘</a>
                </span>
                <span class="item_title"><a href="javascript:;">热门品牌</a></span>
                <span class="item clearfix">
                    <a href="">罗马仕</a>
                    <a href="">品胜</a>
                    <a href="">爱国者</a>
                    <a href="">乐心</a>
                    <a href="">捷波朗</a>
                    <a href="">颂拓</a>
                </span>
            </li>
        </ul>
    </div>
</div>
<% for(var i=0;i<dataSet.length; i++) {%>
    <div class="template_box">
        <div class="temp_nav">
            <span class="nav_title"><%=dataSet[i].father%></span>
            <span class="nav_item">
                <% for(var j=0;j<dataSet[i].son.length;j++) {%>
                    <a href=""><%=dataSet[i].son[j]%></a>
                <% }%>
                <a href="" class="more" style="font-size: 1.8rem">更多商品></a>
        </span>
        </div>
        <div class="goodslist clearfix">
            <%
                var goodslen=dataSet[i].goods.length
                var goods=dataSet[i].goods
                if(goodslen>5) {
                    goodslen = 5
                }
            %>
            <% for(var k=0;k< goodslen;k++){%>
                <a class="goods_item" href="">
                    <span class="item-icon"></span>
                    <div class="goods_img">
                        <img style="width: 210px;height:210px;" src="<%=goods[k].img%>">
                    </div>
                    <div class="goods_price">
                        <%
                            var price=goods[k].price.toFixed(2).split('.')
                        %>
                        <span><em>￥</em><b><%=price[0]%>.</b><small><%=price[1]%></small></span>
                    </div>
                    <div class="goods_info">
                        <span><%=goods[k].info%></span>
                    </div>
                </a>
            <%}%>
        </div>
    </div>
<% }%>
<script src="/js/jquery-3.4.1.js"></script>
<script src="/js/index.js"></script>
</body>
</html>